<template>
  <el-dialog :title="title" :visible.sync="visible" center class="header">
    <el-container>
      <el-main>
        <el-form :label-position="labelPosition" :rules="rules" ref="form" label-width="100px" :model="addChaStaForm">
          <el-row>
            <el-col :xs="10" :sm="10" :lg="10">
              <el-form-item label="收费标准编号" prop="standard_no">
                <el-input v-model="addChaStaForm.standard_no" :readOnly="!isCreate" :clearable = "isCreate" placeholder="该输入项为必填项"/>
              </el-form-item>
            </el-col>
            <el-col :xs="3" :sm="3" :lg="3">
              <div>&nbsp;</div>
            </el-col>
            <el-col :xs="10" :sm="10" :lg="10">
              <el-form-item label="收费标准名称"  prop="standard_name">
                <el-input v-model="addChaStaForm.standard_name" clearable placeholder="该输入项为必填项"/>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :xs="10" :sm="10" :lg="10">
              <el-form-item label="生效时间" prop="standard_sdate">
                <el-date-picker
                  style="width: 100%"
                  v-model="addChaStaForm.standard_sdate"
                  type="datetime"
                  value-format= "yyyy-MM-dd hh:mm:ss"
                  placeholder="该输入项为必填项">
                </el-date-picker>
              </el-form-item>
            </el-col>
            <el-col :xs="3" :sm="3" :lg="3">
              <div>&nbsp;</div>
            </el-col>
            <el-col :xs="10" :sm="10" :lg="10">
              <el-form-item label="失效时间" prop="standard_edate">
                <el-date-picker
                  style="width: 100%"
                  v-model="addChaStaForm.standard_edate"
                  type="datetime"
                  value-format= "yyyy-MM-dd hh:mm:ss"
                  placeholder="该输入项为必填项">
                </el-date-picker>
              </el-form-item>
            </el-col>
          </el-row>

          <el-row>
            <el-col :xs="10" :sm="10" :lg="10">
              <el-form-item label="计时模糊时间（分钟）" label-width="150px"  prop="standard_blur">
                <el-input v-model="addChaStaForm.standard_blur" clearable />
              </el-form-item>
            </el-col>
            <el-col :xs="3" :sm="3" :lg="3">
              <div>&nbsp;</div>
            </el-col>
            <el-col :xs="10" :sm="10" :lg="10">
              <el-form-item label="免费时长（分钟）" label-width="140px" prop="standard_free">
                <el-input v-model="addChaStaForm.standard_free" clearable/>
              </el-form-item>
            </el-col>
          </el-row>

          <el-row>
           <el-col :xs="20" :sm="20" :lg="20">
            <el-form-item label="使用单位" prop="useorgs">
             <el-select v-model="addChaStaForm.useorgs" multiple placeholder="请选择">
                  <el-option v-for="item in useorgs"  :label="item.value"  :value="item.value"> </el-option>
             </el-select>
            </el-form-item>
           </el-col>
         </el-row>
      </el-form>
      </el-main>
      <el-footer style="text-align: center">
        <el-button v-if='isCreate' type="primary" @click="submitForm('form')" class="btn-search">确定</el-button>
        <el-button v-else type="primary" @click="updateForm('form')" class="btn-search">确定</el-button>
        <el-button @click="resetForm()">重置</el-button>
      </el-footer>
    </el-container>
  </el-dialog>
</template>

<script>
import {
  selectOrgCombobox,
  saveChargeStandard,
  updateChargeStandard
} from "../../../api/chargeStandard";
import cloneDeep from "lodash/cloneDeep";
export default {
  name: "chage-standard-add",
  props: ["dialogAddVisible", "chaStaFormData", "isCreate"],
  data() {
    return {
      addBtn: false,
      visible: false,
      title: "",
      labelPosition: "left",
      addChaStaForm: {
        standard_no: "", // 收费标准编号
        standard_name: "",
        standard_sdate: "",
        standard_edate: "",
        standard_blur: "",
        standard_free: "",
        useorgs: []
      },
      useorgs: [],
      rules: {
        standard_no: [
          { required: true, message: "请输入收费标准编号", trigger: "blur" }
        ],
        standard_name: [
          { required: true, message: "请输入收费标准名称", trigger: "blur" }
        ],
        standard_sdate: [
          { required: true, message: "请输入生效时间", trigger: "blur" }
        ],
        standard_edate: [
          { required: true, message: "请输入失效时间", trigger: "blur" }
        ]
      }
      // pickerOptions: {
      //       :picker-options="pickerOptions"
      //     disabledDate: (time) => {
      //         let start = new Date(Date.parse(this.addChaStaForm.standard_sdate));
      //         return time.getTime() < start;
      //     }
      // },
    };
  },
  mounted: function() {
    selectOrgCombobox().then(content => {
      this.useorgs = content;
    });
  },
  watch: {
    dialogAddVisible: function(val) {
      this.visible = val;
    },
    visible: function(val) {
      this.$emit("update:dialogAddVisible", val);
    },
    chaStaFormData: function(val) {
      this.addChaStaForm = val;
    },
    isCreate: function(val) {
      if (val) {
        this.title = "新增收费大类";
      } else {
        this.title = "修改收费大类";
      }
    },
    "addChaStaForm.standard_edate": function(val) {
      if (val < this.addChaStaForm.standard_sdate) {
        // this.$message({
        //   message: "失效时间不能晚于生效时间",
        //   type: "info"
        // });
         this.$alert("失效时间不能晚于生效时间", "提示信息", {
          confirmButtonText: "确定",
        });
      }
    }
  },
  methods: {
    submitForm: function(form) {
      this.$refs[form].validate(valid => {
        if (valid) {
          this.addBtn = true;
         // let data = cloneDeep(this.addChaStaForm);
          saveChargeStandard(this.addChaStaForm).then(res => {
            this.addBtn = false;
            this.$message({
              message: "添加成功",
              type: "success"
            });
           // this.$emit("addChaStaData", data, 1);
            this.$emit("addChaStaData", this.addChaStaForm, 1);
            this.visible = false;
           // this.$refs[form].resetFields();
          });
        } else {
          return false;
        }
      });
    },
    updateForm(form) {
      this.$refs[form].validate(valid => {
        if (valid) {
          this.addBtn = true;
         // let data = cloneDeep(this.addChaStaForm);
          updateChargeStandard(this.addChaStaForm).then(res => {
            this.addBtn = false;
            this.$message({
              message: "修改成功",
              type: "success"
            });
            //this.$emit("addChaStaData", data, 2);
            this.$emit("addChaStaData", this.addChaStaForm, 2);
            this.visible = false;
           // this.$refs[form].resetFields();
          });
        } else {
          return false;
        }
      });
    },
    resetForm() {
      this.$refs["form"].resetFields();
    }
  }
};
</script>

<style scoped>
</style>
